import React, { Component } from 'react'


import './docu.less'

import { Space, Empty } from 'antd';
import { getLocalStorage } from '../../../../utils/utils'
import { ServerURL } from '../../../../utils/config'
import { getAllFileData } from '../../../../utils/common'
import FileListNav from '../../../../components/filelistnav/filelistnav'
import FileList from '../../../../components/filelist/filelist'

class Video extends Component {
    state = {
        docuData: [],
        selectedFileId: [],
        fileName: '',
        previewVisible: false,
        previewUrl: '',
        previewTitle: '',

    }
    componentDidMount = () => {
        let allFileData = JSON.parse(getLocalStorage('allFileData')) //取本地缓存中的所有文件数据
        if (allFileData) {
            let docuData = allFileData.data.filter((v) => /^application\/(msword|pdf|dot)$/.test(v.mimetype))
            this.setState({ docuData })
        } else {
            let { account } = JSON.parse(getLocalStorage('userInfo'))
            getAllFileData(account)
        }
    }
    setNewData = (data) => {
        let docuData = data.filter((v) => /^application\/(doc|pdf|dot)$/.test(v.mimetype))
        this.setState({
            docuData
        })
    }
    getSelectedId = (selectedFileId, name = "") => {
        let fileName = name.substr(0, name.lastIndexOf('.'))
        this.setState({ selectedFileId, fileName })
    }

    clickPreview = (url, fileName) => {
        if (url && fileName) {
            this.setState({
                previewUrl: ServerURL + url,
                previewVisible: true,
                previewTitle: fileName
            });
        }

    }

    render() {
        const { docuData, fileName, selectedFileId, } = this.state
        return (
            <div>
                <FileListNav selectedFileId={selectedFileId} setNewData={this.setNewData} accept="application/*" fileName={fileName} />
                <div className="TabTitle">
                    <span>文档文件</span>
                    <span>已全部加载，共{docuData.length}个文件</span>
                </div>
                {docuData && docuData.length > 0 ? <Space size="middle">
                    <FileList data={docuData} clickPreview={this.clickPreview} getSelectedId={this.getSelectedId} />
                </Space> : <Empty style={{ marginTop: "15%" }} description="还没有文档文件，赶快去上传吧！" />}

            </div>
        )
    }

}

export default Video
